import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:qgchat/common/global/global.dart';
import 'package:qgchat/widgets/photoView/photoView.dart';


///
/// 广场的图
///

class SquareImgs extends StatelessWidget {
  const SquareImgs({this.imgs, Key key}) : super(key: key);

  final List<String> imgs;

  @override
  Widget build(BuildContext context) {
    if (imgs.length == 1) {
      return _Imgs(
        px(320),
        imgs[0],
        imgs,
        0,
      );
    } else {
      return Container(
        child: Wrap(
          spacing: px(12),
          runSpacing: px(12),
          children: imgs.asMap().keys.map<Widget>((i) {
            return _Imgs(
              px(222),
              imgs[i],
              imgs,
              i,
            );
          }).toList(),
        ),
      );
    }
  }
}

/// 单张图片组件
class _Imgs extends StatelessWidget {
  const _Imgs(this.size, this.imgUrl, this.imgs, this.i, {Key key}) : super(key: key);

  final double size;
  final String imgUrl;
  final List<String> imgs;
  final int i;

  @override
  Widget build(BuildContext context) {
    return ClipRRect(
      borderRadius: BorderRadius.circular(px(6)),
      child: Container(
        width: size,
        height: size,
        color: col("394741"),
        child: FlatButton(
          onPressed: () => PhotoViews.show(context, imgs, index: i),
          padding: EdgeInsets.zero,
          child: CachedNetworkImage(
            width: size,
            height: size,
            imageUrl: "$imgUrl?imageView2/2/w/222",
            fit: BoxFit.cover,
            errorWidget: (context, url, error) {
              return Config.errorNetImage;
            },
          ),
        ),
      ),
    );
  }
}


